﻿<MCard Outlined Flat Color="#F6F8FD" Style="padding:6px 6px 6px 0;">
    <div style="width: 100%; min-height: 312px; height: 312px;">
        <div style="display: flex; height: 312px">
            <div style="width:50px;text-align:center;color:rgb(46,117,182); overflow:hidden;">
                @for (int i = 0; i < _lineCount; i++)
                {
                    var line = i + 1;
                    var isErrorLine = _errorLine == line;
                    var color = isErrorLine ? "color:red;" : "";
                    <div @key="line" style="height:24px;@color">
                        @if (!isErrorLine)
                        {
                            <span>@line</span>
                        }
                        else
                        {
                            <MTooltip Right>
                                <ActivatorContent>
                                <span @attributes="@context.Attrs">@line</span>
                                </ActivatorContent>
                                <ChildContent>
                                    <span>@_error</span>
                                </ChildContent>
                            </MTooltip>
                        }
                    </div>
                }
            </div>
            <textarea style="outline:none; resize:none; width:100%;" 
                      autofocus 
                      disabled=@Disabled
                      @oninput="OnInput" 
                      @ref="Ref" 
                      value="@Value" @onchange="HandleOnChange">
            </textarea>
        </div>
    </div>
</MCard>
